<template>
    <div class="mainDiv" style="padding:10px;box-sizing: border-box;">
        <el-table :data="allshop" :row-key="rowselect" :row-class-name="tableRowClassName" height="100%" @row-click="rowshop">
            <el-table-column prop="id" label="#"></el-table-column>
            <el-table-column prop="name" label="分店名称"></el-table-column>
            <el-table-column prop="isdisable" label="分店状态">
                <template slot-scope="scope">
                    <el-tag type="success" v-if="scope.row.isdisable === 0">正常</el-tag>
                    <el-tag type="danger" v-else>弃用</el-tag>
                </template>
            </el-table-column>
            <el-table-column prop="orcode" label="机构代码"></el-table-column>
            <el-table-column label="选择">
                <template slot-scope="scope">
                    <el-switch v-model="scope.row.select" on-text="是" off-text="否">
                    </el-switch>
                </template>
            </el-table-column>
        </el-table>
        <el-row style="margin-top:20px !important;text-align: right;">
            <el-button size="mini" icon="close" type="danger" onclick="C.closewin()" style="margin-left:10px;">取消关闭</el-button>
            <el-button size="mini" icon="upload2" type="success" @click="submit">确定选择</el-button>
        </el-row>
    </div>
</template>
<script>
// let request = C.getDatas()
import C from '@/common/common.js'
export default {
  name: 'floorPermission',
  data () {
    return {
      input2: '',
      selectbranch: [], // 被选中的分店
      allshop: [], // 所有分店
      expands: [],
      request: {}
    }
  },
  mounted () {
    this.request = C.getDatas()
    this.getsubbranch()
  },
  methods: {
    rowselect: function (row) {
      return row.id
    },
    tableRowClassName: function (row, index) {
      for (var i = 0; i < this.expands.length; i++) {
        if (this.expands[i] == row.id) {
          return 'selectshop'
        }
      }
    },
    rowshop: function (row, event) {
      var that = this
      event.preventDefault()
      if (that.expands.indexOf(row.id) === -1) {
        that.expands.push(row.id)
        row.select = true
      } else {
        that.expands.splice(that.expands.indexOf(row.id), 1)
        row.select = false
      }
    },
    submit: async function () {
      var data = {
        floors: this.expands.toString(),
        id: this.request.id,
        grouptype: this.request.grouptype
      }
      let res = await C.ajax('/organization/rule/setfloorrule', data, 'post')
      if (res) {
        C.closeBrowserWindow(res)
      }
    },
    // 获取所有分店
    getsubbranch: async function () {
      var that = this
      let data = await C.ajax('/organization/rule/getallshop', { id: this.request.id }, 'post')
      if (data) {
        that.allshop = data.floor
        if (data.frule) {
          var aaa = data.frule.split(',')
          aaa.forEach((row) => {
            that.expands.push(parseInt(row))
          })
        }
        that.expands.forEach((row, ind) => {
          that.allshop.forEach((res, inx) => {
            if (row === res.id) {
              res.select = true
            }
          })
        })
      }
    }
  }
}
</script>
<style>
.selectshop {
  background-color: #eef1f6 !important;
}
.el-input {
  margin: 5px 0 10px;
}
</style>